<div class="wrapper-form" style="display:none" id="wrapper-form">
</div>
<table cellpadding="0" cellspacing="0" class="table-listing">
	<tr>
		<th><?php echo __('Name'); ?></th>
		<th><?php echo __('Raw Price'); ?></th>
		<th><?php echo __('Price'); ?></th>
		<th><?php echo __('Hand On'); ?></th>
		<th class="actions"><?php echo __('Actions'); ?></th>
	</tr>
	<?php
	foreach ($variants as $variant): ?>
	<tr class="tr-row">
		<td><?php echo h($variant['Variant']['name']); ?>&nbsp;</td>
		<td><?php echo h($variant['Variant']['raw_price']); ?>&nbsp;</td>
		<td><?php echo h($variant['Variant']['price']); ?>&nbsp;</td>
		<td><?php echo h($variant['Variant']['hand_on']); ?>&nbsp;</td>
		<td class="actions action-cm3">
			<?php echo $this->Html->link(__('Edit'), "#", array('class' => 'act-lk edit-link', 
						'onclick' => 'editVariant(' . $variant['Variant']['id'] . ',' . $id . ');')); ?>
			<?php echo $this->Form->postLink(__('Delete'), array('admin' => true, 'action' => 'deleteVariant', $id, $variant['Variant']['id']), array('class' => 'act-lk del-link'), __('Are you sure you want to delete # %s?', $variant['Variant']['id'])); ?>
		</td>
	</tr>
	<?php endforeach; ?>
</table>
<span style="margin-top:10px; float:right; font-size:12px;">
	<a href="#" id="add-more-variant" class="act-lk select-link"><?php echo __('Add New Variant') ?></a></span>

<script type="text/javascript">
	jQuery(document).ready(function(){
		jQuery("#add-more-variant").click(function(){
			jQuery("#wrapper-form").html('<div class=\'tab-loading\'><?php echo $this->Html->image("ajax-loader.gif", array("alt" => __(""))) ?></br><?php echo __("Loading...") ?></div>');					
			jQuery.ajax({
				type: "get",
				url: "<?php echo Router::url(array('admin' => true, 'controller' => 'products', 'action' => 'loadVariantForm', $id)); ?>",
				//data: { name: "John", location: "Boston" }
			}).done(function( msg ) {
				jQuery("#wrapper-form").html(msg);
				jQuery("#wrapper-form").show();
			});
		});
	});

	function editVariant(variantId, id){
		jQuery("#wrapper-form").html('<div class=\'tab-loading\'><?php echo $this->Html->image("ajax-loader.gif", array("alt" => __(""))) ?></br><?php echo __("Loading...") ?></div>');					
		jQuery.ajax({
			type: "get",
			url: "<?php echo Router::url(array('admin' => true, 'controller' => 'products', 'action' => 'loadVariantForm')); ?>/" + id,
			data: { vid: variantId}
		}).done(function( msg ) {
			jQuery("#wrapper-form").html(msg);
			jQuery("#wrapper-form").show();
		});
	}
</script>
